<template>
  <li :key="item.brandId" ref="node" :style="{height: `${item.height}px`, 'line-height': `${item.height}px`}">
    <div>
      <div>{{ item.name }}</div>
    </div>
  </li>
</template>

<script>
export default {
  props: {
    item: {
      default() {
        return {}
      },
      type: Object
    },
    index: {
      type: Number,
      default: 0
    }
  },
  data() {
    return {

    }
  },
  mounted() {
    this.$emit('update-height', { height: this.$refs.node.getBoundingClientRect().height, index: this.index })
  }
}
</script>
